import React from 'react';
import { Button, Toast, List, InputItem } from 'antd-mobile';
import { createForm } from 'rc-form';
import * as request from '../request';

const Item = List.Item;
const isIPhone = new RegExp('\\biPhone\\b|\\biPod\\b', 'i').test(window.navigator.userAgent);
let moneyKeyboardWrapProps;
if (isIPhone) {
    moneyKeyboardWrapProps = {
        onTouchStart: e => e.preventDefault(),
    };
}

class App extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            data: 0,
            dataArr: [
                0, 0
            ],
            childData: {},
            loading: false,
        }
    }
    componentDidMount() {
        const currentChild = this.props.state.currentChild;
        this.setState({ childData: currentChild });
    }
    onSubmit = () => {
        const { childData } = this.state;
        this.props.form.validateFields((error, value) => {
            this.setState({ loading: true });
            value.id = childData.id;
            if (!error) {
                request.post("/api/services/app/Edu_Children/WeikeHeight?fatherHeight=" + value.fatherHeight + "&motherHeight=" + value.motherHeight + "&height=" + value.height + "&id=" + value.id, null).then((response) => {
                    if (response) {
                        if (response.success) {
                            this.setState({ data: response.result });
                        }
                        else {
                            Toast.fail(response.error.message);
                        }
                        this.setState({ loading: false });
                    }
                });
            }
            else
                this.setState({ loading: false });
        });
    }
    render() {
        const { loading, data, childData, dataArr } = this.state;
        const { getFieldProps, getFieldError } = this.props.form;

        return (
            <form>
                <List>
                    <InputItem
                        {...getFieldProps('fatherHeight', {
                            rules: [
                                { required: true, message: '请输入父亲身高' }
                            ],
                        })}
                        type='number'
                        moneyKeyboardWrapProps={moneyKeyboardWrapProps}
                        placeholder="请输入父亲身高(cm)"
                        clear
                        error={!!getFieldError('fatherHeight')}
                        onErrorClick={() => {
                            Toast.info(getFieldError('fatherHeight').join('、'));
                        }}
                    >父亲身高</InputItem>
                    <InputItem {...getFieldProps('motherHeight', {
                        rules: [
                            { required: true, message: '请输入母亲身高' },
                        ],
                    })}
                        type='number'
                        moneyKeyboardWrapProps={moneyKeyboardWrapProps}
                        placeholder="请输入母亲身高(cm)"
                        clear
                        error={!!getFieldError('motherHeight')}
                        onErrorClick={() => {
                            Toast.info(getFieldError('motherHeight').join('、'));
                        }}> 母亲身高 </InputItem>

                    <InputItem {...getFieldProps('height', {
                        rules: [
                            { required: true, message: '请输入宝宝2岁身高' },
                        ],
                    })}
                        type='number'
                        moneyKeyboardWrapProps={moneyKeyboardWrapProps}
                        placeholder="请输入宝宝2岁身高(cm)"
                        clear
                        error={!!getFieldError('height')}
                        onErrorClick={() => {
                            Toast.info(getFieldError('height').join('、'));
                        }}> 2岁身高 </InputItem>

                    <Item>
                        <Button type="primary" onClick={this.onSubmit} loading={loading}>提交</Button>
                    </Item>
                    <Item>您的宝宝预计身高：{data} cm </Item>
                </List>
            </form>
        )
    };
}

export default createForm()(App);
